<template>
  <div class="dev-details">
    <info-title>基础信息</info-title>
    <descriptions :columns="columns.slice(0, -4)" :data-source="details" :col-span="12" />
    <template v-if="details.handle_status == 1">
      <info-title>处理信息</info-title>
      <descriptions :columns="columns.slice(-4, -1)" :data-source="details" :col-span="12" />
    </template>
    <template v-if="details.send_sms_status == 1">
      <info-title>推送信息</info-title>
      <descriptions :columns="columns.slice(-1)" :data-source="details" />
    </template>
  </div>
</template>

<script>
import { getEnumText } from '@gis/lib/enums/index.js';

export default {
  name: 'dev-details',
  components: {},
  props: {
    details: { type: Object, default: () => {} },
  },
  data() {
    return {
      columns: [
        { label: '预警时间', key: 'warn_time' },
        { label: '预警类型', key: 'warn_type_name' },
        { label: '预警内容', key: 'warn_content' },
        // { label: '所属区域', key: 'area_name' },
        { label: '设备名称', key: 'field2' },
        { label: '设备序列号', key: 'field1' },
        { label: '是否处理', key: 'handle_status', format: (v) => getEnumText('alarmHandleStatus', v) },
        { label: '是否发送短信', key: 'send_sms_status', format: (v) => getEnumText('isPush', v) },
        { label: '处理时间', key: 'handle_time' },
        { label: '处理人', key: 'handle_people_name' },
        { label: '处理结果', key: 'handle_result' },
        { label: '推送人员', key: 'send_sms_people' },
      ],
    };
  },
};
</script>

<style scoped lang="less">
.dev-details {
  padding: 20px;
  overflow: hidden;
}
</style>
